<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      lang="en-us"
      xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <!--<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">-->

    <title> 新闻后台管理 </title>
    <meta name="description" content=""/>
    <meta name="author" content=""/>

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

    <!-- Basic Styles -->
    <link rel="stylesheet" type="text/css" media="screen" href="../../static/css/bootstrap.min.css" th:href="@{/resources/css/bootstrap.min.css}" />
    <link rel="stylesheet" type="text/css" media="screen" href="../../static/css/font-awesome.min.css" th:href="@{/resources/css/font-awesome.min.css}"/>

    <!-- SmartAdmin Styles : Caution! DO NOT change the order -->
    <link rel="stylesheet" type="text/css" media="screen" href="../../static/css/smartadmin-production-plugins.min.css" th:href="@{/resources/css/smartadmin-production-plugins.min.css}"/>
    <link rel="stylesheet" type="text/css" media="screen" href="../../static/css/smartadmin-production.min.css" th:href="@{/resources/css/smartadmin-production.min.css}"/>
    <link rel="stylesheet" type="text/css" media="screen" href="../../static/css/smartadmin-skins.min.css" th:href="@{/resources/css/smartadmin-skins.min.css}"/>

    <!-- SmartAdmin RTL Support -->
    <link rel="stylesheet" type="text/css" media="screen" href="../../static/css/smartadmin-rtl.min.css" th:href="@{/resources/css/smartadmin-rtl.min.css}"/>

    <!-- FAVICONS -->
    <link rel="shortcut icon" href="../../static/img/favicon/favicon.ico" type="image/x-icon" th:href="@{/resources/img/favicon/favicon.ico}"/>
    <link rel="icon" href="../../static/img/favicon/favicon.ico" type="image/x-icon" th:href="@{/resources/img/favicon/favicon.ico}"/>

</head>

<body class="">

<!-- HEADER -->
<header id="header">
    <div id="logo-group">

        <!-- PLACE YOUR LOGO HERE -->
        <span id="logo"><a th:href="@{/}"> <img th:src="@{/resources/img/logo.png}" alt="logo" /></a></span>
        <!-- END LOGO PLACEHOLDER -->

    </div>

    <!-- pulled right: nav area -->
    <div class="pull-right">

        <!-- collapse menu button -->
        <div id="hide-menu" class="btn-header pull-right">
            <span> <a href="javascript:void(0);" data-action="toggleMenu" title="Collapse Menu"><i class="fa fa-reorder">隐藏</i></a> </span>
        </div>
        <!-- end collapse menu -->

        <!-- logout button -->
        <div id="logout" class="btn-header transparent pull-right">
            <span> <a th:href="@{/logout}" title="登出" data-action="userLogout" data-logout-msg="您确定要退出登录吗?"><i class="fa fa-sign-out">退出</i></a> </span>
        </div>
        <!-- end logout button -->

        <!-- fullscreen button -->
        <div id="fullscreen" class="btn-header transparent pull-right">
            <span> <a href="javascript:void(0);" data-action="launchFullscreen" title="全屏"><i class="fa fa-arrows-alt">全屏</i></a> </span>
        </div>
        <!-- end fullscreen button -->
        <!-- home button -->
        <div id="home" class="btn-header transparent pull-right">
            <span> <a th:href="@{/}" title="回到首页"><i class="fa fa-home">首页</i></a> </span>
        </div>
        <!-- end home button -->

    </div>
    <!-- end pulled right: nav area -->

</header>
<!-- END HEADER -->

<!-- MAIN PANEL -->
<div id="" role="main">

    <!-- RIBBON -->
    <div id="ribbon">

        <!-- breadcrumb -->
        <ol class="breadcrumb">
            <i class="fa fa-arrow-right"></i>
            <li class="fa fa-lg" th:text="'修改新闻'"></li>
        </ol>

    </div>
    <!-- END RIBBON -->

    <!-- MAIN CONTENT -->
    <div id="content">

        <!-- widget grid -->
        <section id="widget-grid" class="">

            <!-- row -->
            <div class="row">

                <article class="col-xs-12 col-sm-12 col-md-12 col-lg-8 col-lg-offset-2">

                    <!-- Widget ID (each widget will need unique ID)-->
                    <div class="jarviswidget jarviswidget-color-red" id="wid-id-1" data-widget-editbutton="false" data-widget-deletebutton="false" data-widget-custombutton="false">

                        <header>
                            <span class="widget-icon"> <i class="fa fa-info-circle"></i></span>
                            <h2>修改新闻</h2>

                        </header>

                        <!-- widget div-->
                        <div>

                            <!-- widget content -->
                            <div class="widget-body">

                                <form class="smart-form" id="articleForm">
                                    <header>
                                        编辑内容
                                    </header>
                                    <fieldset>
                                        <div class="row" >

                                            <section style="text-align: center">
                                                <label class="col col-3 label font-md">所属栏目：
                                                </label>
                                                <label class="select col col-4">
                                                    <select class="input font-md" id="select_column">
                                                        <div th:each="channel : ${channels}">
                                                            <option th:each="column : ${channel.columns}"
                                                                    th:value="${column.column_id}"
                                                                    th:text="${channel.title}+' - '+ ${column.title}">频道 - 栏目</option>
                                                        </div>

                                                    </select><i></i>
                                                </label>
                                            </section>
                                        </div>
                                        <br/>
                                        <div class="row" >
                                            <section style="text-align: center">
                                                <label class="col col-3 label font-md">新闻标题：
                                                </label>
                                                <input class="col col-6 font-md" id="title" th:value="${article.title}" name="title"/>
                                            </section>
                                        </div>
                                        <br/>
                                        <div class="row" >
                                            <section style="text-align: center">
                                                <label class="col col-3 label font-md">新闻来源：
                                                </label>
                                                <input class="col col-6 font-md" id="source" th:value="${article.source}" name="source"/>
                                            </section>
                                        </div>
                                        <br/>
                                        <div class="row">
                                            <textarea id="editContentBox" th:utext="${article.content}"></textarea>
                                        </div>
                                    </fieldset>
                                    <footer>
                                        <!-- 保存按钮 -->
                                        <button type="button" id="save_article_btn" href="javascript:" class="btn btn-primary">
                                            <i class="fa fa-save"></i>
                                            保存
                                        </button>
                                        <!-- 返回按钮 -->
                                        <button type="button" onclick="javascript:history.back();" class="back_btn btn btn-danger">
                                            <i class="fa fa-backward"></i>
                                            返回
                                        </button>
                                    </footer>

                                </form>

                            </div>
                            <!-- end widget content -->

                        </div>
                        <!-- end widget div -->

                    </div>
                    <!-- end widget -->

                </article>

            </div>

            <!-- end row -->

        </section>
        <!-- end widget grid -->

    </div>
    <!-- END MAIN CONTENT -->

</div>
<!-- END MAIN PANEL -->

<!-- PAGE FOOTER -->
<div class="page-footer">
    <div class="row">
        <div class="col-xs-12 col-sm-6">
            <span class="txt-color-white">新闻后台管理</span>
        </div>

    </div>
</div>
<!-- END PAGE FOOTER -->


<!--================================================== -->

<script src="../../static/js/libs/jquery-2.1.1.min.js" th:src="@{/resources/js/libs/jquery-2.1.1.min.js}"></script>

<script src="../../static/js/libs/jquery-ui-1.10.3.min.js" th:src="@{/resources/js/libs/jquery-ui-1.10.3.min.js}"></script>

<!-- IMPORTANT: APP CONFIG -->
<script src="../../static/js/app.config.js" th:src="@{/resources/js/app.config.js}"></script>

<!-- BOOTSTRAP JS -->
<script src="../../static/js/bootstrap/bootstrap.min.js" th:src="@{/resources/js/bootstrap/bootstrap.min.js}"></script>

<!-- JARVIS WIDGETS -->
<script src="../../static/js/smartwidgets/jarvis.widget.min.js" th:src="@{/resources/js/smartwidgets/jarvis.widget.min.js}"></script>

<!-- JQUERY VALIDATE -->
<script src="../../static/js/plugin/jquery-validate/jquery.validate.min.js" th:src="@{/resources/js/plugin/jquery-validate/jquery.validate.min.js}"></script>

<!-- JQUERY MASKED INPUT -->
<script src="../../static/js/plugin/masked-input/jquery.maskedinput.min.js" th:src="@{/resources/js/plugin/masked-input/jquery.maskedinput.min.js}"></script>

<!-- JQUERY SELECT2 INPUT -->
<script src="../../static/js/plugin/select2/select2.min.js" th:src="@{/resources/js/plugin/select2/select2.min.js}"></script>

<!--[if IE 8]>

<h1>Your browser is out of date, please update your browser by going to www.microsoft.com/download</h1>

<![endif]-->

<!-- MAIN APP JS FILE -->
<script src="../../static/js/app.min.js" th:src="@{/resources/js/app.min.js}"></script>
<script src="../../static/js/plugin/jquery-nestable/jquery.nestable.min.js" th:src="@{/resources/js/plugin/jquery-nestable/jquery.nestable.min.js}"></script>

<script src="../../static/js/plugin/ckeditor/ckeditor.js" th:src="@{/resources/js/plugin/ckeditor/ckeditor.js}"></script>

<!-- PAGE RELATED PLUGIN(S) -->
<script th:inline="javascript">
    /*<![CDATA[*/


    // DO NOT REMOVE : GLOBAL FUNCTIONS!
    $(document).ready(function() {

        pageSetUp();


        var column_id;
        /*[+
         column_id = [[${article.column_id}]];
         +]*/

        $('#select_column').val(column_id);

        $("#save_article_btn").click(function () {

            var formData = new FormData(document.getElementById("articleForm"));
            var url;
            var news_id = "";

            /*[+
                url = [[@{/article/save}]];
                news_id = [[${article.article_id}]];
             +]*/

            formData.append("content",CKEDITOR.instances.editContentBox.getData());
            column_id = $('#select_column').val();
            formData.append("column_id",column_id);
            formData.append("news_id",news_id);

            $.ajax({
                url:url,
                contentType:false,
                processData:false,
                data:formData,
                type:"POST",
                success: function (data) {
                    alert("保存成功!");
                    location.reload();
                    return false;
                },
                error: function () {
                    alert("保存失败!");
                    return false;
                }

            });
        })
        CKEDITOR.replace( 'editContentBox', { height: '700px'} );


    });


    /*]]>*/

</script>


</body>

</html>